<template>
	<eui-page-frame topHeight="694">
		<template #top>
			<view class="content-img" :style="[bgimage]">
				<eui-nav-bar />
			</view>
			<view style="margin:-80rpx 20rpx 16rpx 20rpx;">
					<eui-week-calendar :value="currentDay" @change="changeDate"  :selectBg="selectBg" :selectShadow="selectShadow" :themeColor="themeColor" />
			</view>
			<view style="margin: 0px 20rpx;">
				<eui-tab :tabs="tabData" :spaceLeft="spaceLeft" :value="tabIndex" @change="tabChange">
				</eui-tab>
			</view>
		</template>
		<eui-page-content>
			<eui-base-card v-for="(item, index) in dataList" :key="index" @click="openDetail(item)"
				:title="item.project">
				<!-- <template #left>
						<view class="e-attachment">
							<image class="e-attachment__image" :src="item.cover" mode="aspectFill" />
						</view>
					</template> -->
				<template #right>
					<eui-tag :text="item.status" plain plainFill :showBorder="false" :type="'复检完成,待评价,已完成'.includes(item.status)?'success':undefined"> </eui-tag>
				</template>
				<eui-detail-show :items="dataItems" v-model="dataList[index]" size="small"></eui-detail-show>
				<eui-line margin="20rpx 0rpx -20rpx 0rpx"></eui-line>
			</eui-base-card>

			<eui-base-card v-if="dataList.length == 0">
				<view class="nodata">
					<image src="@/static/img/no_data.png" mode="aspectFit" class="nodata-image" />
				</view>
			</eui-base-card>
		</eui-page-content>
	</eui-page-frame>
</template>

<script setup lang="ts">
import { onLoad, onShow } from '@dcloudio/uni-app';
import { ref } from 'vue';
import useService from '@/hooks/useService';
import { initRdsPatrolPeriod,initRdsPartolSubject } from '@/hooks/init';
import { getRelatedName, getOtherStorageName } from '../components/RelatedName.js';
import dayjs from 'dayjs';
import { storeToRefs } from 'pinia';
import { useThemeStore } from '@/store/themeStore';
const themeStore = useThemeStore(); // 主题
const { theme } = storeToRefs(themeStore);
const bgimage = ref(theme._object.theme=='theme-blue'?"background-image: url(../../../static/img/rdsImgs/top_xcggt_blue.jpg);":'background-image: url(../../../static/img/rdsImgs/top_xcggt_orange.jpg);');
const themeColor = ref(theme._object.theme=='theme-blue'?'rgb(2, 183, 230)':'#FF6430')
const selectBg= ref(theme._object.theme=='theme-blue'?"linear-gradient( 135deg, #02B7E6 0%, #36A9F3 100%)":'linear-gradient( 135deg, #FF8359 0%, #FF6430 100%)')
const selectShadow=ref(theme._object.theme=='theme-blue'?"0rpx 0rpx 20rpx 0rpx rgba(2,183,230,0.2)":"0rpx 0rpx 20rpx 0rpx rgba(255, 100, 48, 0.2)")

const service = useService({ prefix: "apiApi" });

const currentDay = ref(dayjs(new Date()).format('YYYY-MM-DD'));
const statusValue = ref('1');

const whereList = ref([
	{ c_col: "c_bill_type", c_oper: "左相似", c_value: 'DB', c_logic: "而且" },
	{ c_col: "c_work_status", c_oper: "包含", c_value: '1', c_logic: "而且" },
	{ c_col: "c_date", c_oper: "等于", c_value: dayjs(currentDay.value).format('YYYY-MM-DD') , c_logic: "而且" },
])

const dataItems = [
	{
		label: "负责人",
		prop: "user",
		type: "text",
		element: {
		},
	},
	{
		label: "巡场时段",
		prop: "dateTime",
		type: "text",
		element: {
		},
	}
]

const tabData = ref([{ name: '待处理' }, { name: '待复检' }, { name: '已完成' }]);

const tabIndex = ref(0);
const spaceLeft = ref(6);

const dataList = ref([
	// { workId: '',id: '',project:'', user: '', planSdt: '', planEndt: '', content: '', status: '已处理',dateTime:'' },
]);

const changeDate = async (e)=>{
		currentDay.value=e;
		await getData();
}

onLoad(async () => {
	await initRdsPatrolPeriod();
	await initRdsPartolSubject();
})
const tabChange = async (e) => {
	tabIndex.value = e;
	statusValue.value = e === 1 ? '5' : (e === 2 ? '3,4,7' : '1');
	await getData();
}

onShow(() => {
	getData();
})
//获取巡场任务数据
const getData = async () => {
	whereList.value = [
		{ c_col: "c_bill_type", c_oper: "左相似", c_value: 'DB', c_logic: "而且" },
		{ c_col: "c_work_status", c_oper: "包含", c_value: statusValue.value, c_logic: "而且" },
		{ c_col: "c_date", c_oper: "等于", c_value: dayjs(currentDay.value).format('YYYY-MM-DD') , c_logic: "而且" },
	]
	const req = {
		WhereList: whereList.value
	}
	uni.showLoading({ title: "查询中...", mask: true });
	const res = await service.request('管易通物业模块服务', 'GetPatrolTaskData', req);
	uni.hideLoading();
	dataList.value = [];
	if (res && res.ReturnObject) {
		console.log('申请数据', JSON.stringify(res.ReturnObject))
		const objectData = res.ReturnObject;
		if (objectData.length > 0) {
			dataList.value = objectData.map(x => {
				return {
					workId: x.c_work_id,
					project: x.c_plan_name||x.c_partol_type_name,
					user: '[' + x.c_charge_userno + ']' + getRelatedName('rdsUsers', x.c_charge_userno),
					planSdt: x.c_plan_sdt,
					planEndt: x.c_plan_edt,
					status: x.c_work_status_name,
					dateTime: x.c_plan_sdt.substring(11, 16) + '-' + x.c_plan_edt.substring(11, 16),
				}
			});
		}
	}
}

const openDetail = (e) => {
	uni.navigateTo({
		url: `./detail?id=${e.workId}&project=${encodeURIComponent(e.project)}`
	});
}
</script>

<style lang="scss">
.content-img {
	background-image: url(../../../static/img/rdsImgs/top_xcggt_blue.jpg);
	background-size: 100% 420rpx;
	background-repeat: no-repeat;
	width: 100%;
	height: 420rpx;
}

.image-min {
	width: 100%;
	height: 100rpx;
}

.nodata {
	width: 100%;
	height: 560rpx;

	image {
		width: 100%;
		height: 80%;
		opacity: 0.4;
	}
}

</style>